<template>
  <div class="box">
      <div class="user">
          <img v-if="postdata.user.head_img" :src="postdata.user.head_img" alt="">
          <img v-else src="@/assets/14.png" alt="">
          <div class="tet">
              <span>{{postdata.user.nickname}}</span> <br>
              <samp>两小时前</samp>
          </div>
          <div class="mess"  @click="reqly">回复</div>
      </div>
      
        <parent v-if="postdata.parent" :post="postdata.parent" @reqlyS="reqlyS" />

      <div class="comment">
          {{postdata.content}}
      </div>
  </div>
</template>

<script>
import parent from '@/components/comment/parent'
export default {
    props:["postdata"],
    components:{
        parent,
    },
    methods:{
        reqly(){
            console.log("回复:"+this.postdata.user.nickname);
            this.$emit("reqly",this.postdata.id,this.postdata.user.nickname)
        },
        reqlyS(id){
            this.$emit("reqly",id)
        }
    }
}
</script>

<style lang="less" scoped>
.box{
    padding: 15/360*100vw 15/360*100vw 0 ;
    .user{
        display: flex;
        background-color: #f7f8fa;
        img{
            max-width: 30/360*100vw;
            height: 30/360*100vw;
            border-radius: 50%;
        }
        .tet{
            flex: 1;
            //margin-left: 6/360*100vw;
            samp{
                font-size: 11/360*100vw;
                color: #9e9a9a;
            }
        }
        .mess{
            font-size: 15/360*100vw;
        }
    }
    .comment{
        padding: 6/360*100vw 0;
        //border-bottom: solid 2px #747272;
        background-color: #f7f8fa;
    }
}
</style>